<%@ taglib uri="/struts-tags" prefix="s" %>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="jcarousel.js"></script>
</head>
<body>  
<div class="carousel auto">
    <div class="jCarouselLite">
      <ul>
      <li><img  src="capo.jpg" border="15px"/></li>
      <li><img  src="catarata.jpg" border="15px"/></li>
      <li><img  src="coliseo.jpg" border="15px"/></li>
      <li><img  src="elsalvador2.jpg" border="15px"/></li>
      <li><img  src="images.jpg" border="15px"/></li>
      <li><img  src="indu.jpg" border="15px"/></li>
      <li><img  src="luna.jpg" border="15px"/></li>
      <li><img  src="machu.jpg" border="15px"/></li>
      <li><img  src="Piramide.jpg" border="15px"/></li>
      <li><img  src="torre.jpg" border="15px"/></li>
      <li><img  src="viajero.jpg" border="15px"/></li>
      </ul>
   </div>
</div>
<script type="text/javascript">
$(".auto .jCarouselLite").jCarouselLite({
    auto: 300,  
    visible:5  
    speed: 1500,
});
</script>
<hr>
<button class="prev"><<</button>
<button class="next">>></button>

<div class="anyClass">
    <ul>
<li><img  src="125x125.jpg" border="4px"/></li>
<li><img  src="125x125.jpg" border="4px"/></li>
<li><img  src="125x125.jpg" border="4px"/></li>
<li><img  src="125x125.jpg" border="4px"/></li>
    </ul>
</div>
<script type="text/javascript">
$(function() {
    $(".anyClass").jCarouselLite({
        btnNext: ".next",
        btnPrev: ".prev"
    });
});
</script>
<hr>

</body>
</html>
